Skip to content

Commit 6b0a022

Browse files
lints
1 parent 10ec64e commit 6b0a022

File tree

5 files changed

+86
-61
lines changed

5 files changed

+86
-61
lines changed

invokeai/frontend/web/src/features/controlLayers/components/InpaintMask/InpaintMaskBboxAdjuster.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,17 +3,20 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
33
import { bboxChangedFromCanvas } from 'features/controlLayers/store/canvasSlice';
44
import { selectMaskBlur } from 'features/controlLayers/store/paramsSlice';
55
import { selectCanvasSlice } from 'features/controlLayers/store/selectors';
6-
import type {
7-
Rect,
6+
import type {
87
CanvasBrushLineState,
98
CanvasBrushLineWithPressureState,
109
CanvasEraserLineState,
1110
CanvasEraserLineWithPressureState,
12-
CanvasRectState,
1311
CanvasImageState,
12+
CanvasRectState,
13+
Rect,
1414
} from 'features/controlLayers/store/types';
15-
import { transformMaskObjectsRelativeToBbox, calculateMaskBoundsFromBitmap } from 'features/controlLayers/util/maskObjectTransform';
1615
import { convertTransformedToOriginal } from 'features/controlLayers/util/coordinateTransform';
16+
import {
17+
calculateMaskBoundsFromBitmap,
18+
transformMaskObjectsRelativeToBbox,
19+
} from 'features/controlLayers/util/maskObjectTransform';
1720
import { memo, useCallback, useMemo } from 'react';
1821
import { useTranslation } from 'react-i18next';
1922
import { PiCropBold } from 'react-icons/pi';
@@ -43,7 +46,7 @@ export const InpaintMaskBboxAdjuster = memo(() => {
4346
| CanvasRectState
4447
| CanvasImageState
4548
)[] = [];
46-
49+
4750
for (const mask of inpaintMasks) {
4851
if (!mask.isEnabled || !mask.objects || mask.objects.length === 0) {
4952
continue;
@@ -62,7 +65,7 @@ export const InpaintMaskBboxAdjuster = memo(() => {
6265

6366
// Calculate bounds from the rendered bitmap for accurate results
6467
const maskBounds = calculateMaskBoundsFromBitmap(allObjects, bboxRect.width, bboxRect.height);
65-
68+
6669
if (!maskBounds) {
6770
return null;
6871
}

invokeai/frontend/web/src/features/controlLayers/hooks/useCanvasAdjustBboxHotkey.ts

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,17 +4,20 @@ import { useCanvasIsBusy } from 'features/controlLayers/hooks/useCanvasIsBusy';
44
import { bboxChangedFromCanvas } from 'features/controlLayers/store/canvasSlice';
55
import { selectMaskBlur } from 'features/controlLayers/store/paramsSlice';
66
import { selectCanvasSlice } from 'features/controlLayers/store/selectors';
7-
import type {
8-
Rect,
7+
import type {
98
CanvasBrushLineState,
109
CanvasBrushLineWithPressureState,
1110
CanvasEraserLineState,
1211
CanvasEraserLineWithPressureState,
13-
CanvasRectState,
1412
CanvasImageState,
13+
CanvasRectState,
14+
Rect,
1515
} from 'features/controlLayers/store/types';
16-
import { transformMaskObjectsRelativeToBbox, calculateMaskBoundsFromBitmap } from 'features/controlLayers/util/maskObjectTransform';
1716
import { convertTransformedToOriginal } from 'features/controlLayers/util/coordinateTransform';
17+
import {
18+
calculateMaskBoundsFromBitmap,
19+
transformMaskObjectsRelativeToBbox,
20+
} from 'features/controlLayers/util/maskObjectTransform';
1821
import { useRegisteredHotkeys } from 'features/system/components/HotkeysModal/useHotkeyData';
1922
import { useCallback, useMemo } from 'react';
2023

@@ -42,7 +45,7 @@ export const useCanvasAdjustBboxHotkey = () => {
4245
| CanvasRectState
4346
| CanvasImageState
4447
)[] = [];
45-
48+
4649
for (const mask of inpaintMasks) {
4750
if (!mask.isEnabled || !mask.objects || mask.objects.length === 0) {
4851
continue;
@@ -61,7 +64,7 @@ export const useCanvasAdjustBboxHotkey = () => {
6164

6265
// Calculate bounds from the rendered bitmap for accurate results
6366
const maskBounds = calculateMaskBoundsFromBitmap(allObjects, bboxRect.width, bboxRect.height);
64-
67+
6568
if (!maskBounds) {
6669
return null;
6770
}
@@ -104,4 +107,4 @@ export const useCanvasAdjustBboxHotkey = () => {
104107
options: { enabled: isAdjustBboxAllowed && !isBusy, preventDefault: true },
105108
dependencies: [isAdjustBboxAllowed, isBusy, handleAdjustBbox],
106109
});
107-
};
110+
};

invokeai/frontend/web/src/features/controlLayers/hooks/useCanvasInvertMaskHotkey.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { useAssertSingleton } from 'common/hooks/useAssertSingleton';
33
import { useCanvasIsBusy } from 'features/controlLayers/hooks/useCanvasIsBusy';
44
import { inpaintMaskInverted } from 'features/controlLayers/store/canvasSlice';
55
import { selectCanvasSlice, selectSelectedEntityIdentifier } from 'features/controlLayers/store/selectors';
6+
import type { CanvasEntityIdentifier } from 'features/controlLayers/store/types';
67
import { useRegisteredHotkeys } from 'features/system/components/HotkeysModal/useHotkeyData';
78
import { useCallback, useMemo } from 'react';
89

@@ -27,7 +28,11 @@ export const useCanvasInvertMaskHotkey = () => {
2728
return;
2829
}
2930

30-
dispatch(inpaintMaskInverted({ entityIdentifier: selectedEntityIdentifier as any }));
31+
dispatch(
32+
inpaintMaskInverted({
33+
entityIdentifier: selectedEntityIdentifier as CanvasEntityIdentifier<'inpaint_mask'>,
34+
})
35+
);
3136
}, [dispatch, selectedEntityIdentifier, canvasSlice]);
3237

3338
const isInvertMaskAllowed = useMemo(() => {
@@ -49,4 +54,4 @@ export const useCanvasInvertMaskHotkey = () => {
4954
options: { enabled: isInvertMaskAllowed && !isBusy, preventDefault: true },
5055
dependencies: [isInvertMaskAllowed, isBusy, handleInvertMask],
5156
});
52-
};
57+
};

invokeai/frontend/web/src/features/controlLayers/util/coordinateTransform.ts

Lines changed: 39 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import type {
33
CanvasBrushLineWithPressureState,
44
CanvasEraserLineState,
55
CanvasEraserLineWithPressureState,
6-
CanvasRectState,
76
CanvasImageState,
7+
CanvasRectState,
88
Coordinate,
99
Rect,
1010
} from 'features/controlLayers/store/types';
@@ -75,7 +75,13 @@ export interface TransformedImage {
7575
* @returns A new mask object with transformed coordinates
7676
*/
7777
export function transformMaskObject(
78-
obj: CanvasBrushLineState | CanvasBrushLineWithPressureState | CanvasEraserLineState | CanvasEraserLineWithPressureState | CanvasRectState | CanvasImageState,
78+
obj:
79+
| CanvasBrushLineState
80+
| CanvasBrushLineWithPressureState
81+
| CanvasEraserLineState
82+
| CanvasEraserLineWithPressureState
83+
| CanvasRectState
84+
| CanvasImageState,
7985
offset: Coordinate
8086
): TransformedMaskObject {
8187
switch (obj.type) {
@@ -151,10 +157,7 @@ export function transformRect(rect: Rect, offset: Coordinate): Rect {
151157
* @param container The container rectangle to clip to
152158
* @returns A new mask object clipped to the container boundaries, or null if completely outside
153159
*/
154-
export function clipMaskObjectToContainer(
155-
obj: TransformedMaskObject,
156-
container: Rect
157-
): TransformedMaskObject | null {
160+
export function clipMaskObjectToContainer(obj: TransformedMaskObject, container: Rect): TransformedMaskObject | null {
158161
switch (obj.type) {
159162
case 'brush_line':
160163
case 'brush_line_with_pressure':
@@ -172,28 +175,32 @@ export function clipMaskObjectToContainer(
172175
* Clips a line object to container boundaries.
173176
*/
174177
function clipLineToContainer(
175-
obj: TransformedBrushLine | TransformedBrushLineWithPressure | TransformedEraserLine | TransformedEraserLineWithPressure,
178+
obj:
179+
| TransformedBrushLine
180+
| TransformedBrushLineWithPressure
181+
| TransformedEraserLine
182+
| TransformedEraserLineWithPressure,
176183
container: Rect
177184
): typeof obj | null {
178185
// For lines, we clip the points to the container boundaries
179186
const clippedPoints: number[] = [];
180-
187+
181188
for (let i = 0; i < obj.points.length; i += 2) {
182189
const x = obj.points[i] ?? 0;
183190
const y = obj.points[i + 1] ?? 0;
184-
191+
185192
// Clip coordinates to container boundaries
186193
const clippedX = Math.max(container.x, Math.min(container.x + container.width, x));
187194
const clippedY = Math.max(container.y, Math.min(container.y + container.height, y));
188-
195+
189196
clippedPoints.push(clippedX, clippedY);
190197
}
191-
198+
192199
// If no points remain, return null
193200
if (clippedPoints.length === 0) {
194201
return null;
195202
}
196-
203+
197204
return {
198205
...obj,
199206
points: clippedPoints,
@@ -206,18 +213,18 @@ function clipLineToContainer(
206213
*/
207214
function clipRectToContainer(obj: TransformedRect, container: Rect): TransformedRect | null {
208215
const rect = obj.rect;
209-
216+
210217
// Calculate intersection
211218
const left = Math.max(rect.x, container.x);
212219
const top = Math.max(rect.y, container.y);
213220
const right = Math.min(rect.x + rect.width, container.x + container.width);
214221
const bottom = Math.min(rect.y + rect.height, container.y + container.height);
215-
222+
216223
// If no intersection, return null
217224
if (left >= right || top >= bottom) {
218225
return null;
219226
}
220-
227+
221228
return {
222229
...obj,
223230
rect: {
@@ -232,7 +239,7 @@ function clipRectToContainer(obj: TransformedRect, container: Rect): Transformed
232239
/**
233240
* Clips an image object to container boundaries.
234241
*/
235-
function clipImageToContainer(obj: TransformedImage, container: Rect): TransformedImage | null {
242+
function clipImageToContainer(obj: TransformedImage, _container: Rect): TransformedImage | null {
236243
// For images, we don't clip them - they remain as-is
237244
return obj;
238245
}
@@ -260,17 +267,21 @@ export function calculateMaskObjectBounds(obj: TransformedMaskObject): Rect | nu
260267
* Calculates bounds for a line object.
261268
*/
262269
function calculateLineBounds(
263-
obj: TransformedBrushLine | TransformedBrushLineWithPressure | TransformedEraserLine | TransformedEraserLineWithPressure
270+
obj:
271+
| TransformedBrushLine
272+
| TransformedBrushLineWithPressure
273+
| TransformedEraserLine
274+
| TransformedEraserLineWithPressure
264275
): Rect | null {
265276
if (obj.points.length < 2) {
266277
return null;
267278
}
268-
279+
269280
let minX = obj.points[0] ?? 0;
270281
let minY = obj.points[1] ?? 0;
271282
let maxX = minX;
272283
let maxY = minY;
273-
284+
274285
for (let i = 2; i < obj.points.length; i += 2) {
275286
const x = obj.points[i] ?? 0;
276287
const y = obj.points[i + 1] ?? 0;
@@ -279,7 +290,7 @@ function calculateLineBounds(
279290
maxX = Math.max(maxX, x);
280291
maxY = Math.max(maxY, y);
281292
}
282-
293+
283294
// Add stroke width to bounds
284295
const strokeRadius = obj.strokeWidth / 2;
285296
return {
@@ -310,7 +321,13 @@ function calculateImageBounds(obj: TransformedImage): Rect | null {
310321
*/
311322
export function convertTransformedToOriginal(
312323
obj: TransformedMaskObject
313-
): CanvasBrushLineState | CanvasBrushLineWithPressureState | CanvasEraserLineState | CanvasEraserLineWithPressureState | CanvasRectState | CanvasImageState {
324+
):
325+
| CanvasBrushLineState
326+
| CanvasBrushLineWithPressureState
327+
| CanvasEraserLineState
328+
| CanvasEraserLineWithPressureState
329+
| CanvasRectState
330+
| CanvasImageState {
314331
switch (obj.type) {
315332
case 'brush_line':
316333
return {
@@ -337,4 +354,4 @@ export function convertTransformedToOriginal(
337354
case 'image':
338355
return obj;
339356
}
340-
}
357+
}

invokeai/frontend/web/src/features/controlLayers/util/maskObjectTransform.ts

Lines changed: 21 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,20 @@ import type {
33
CanvasBrushLineWithPressureState,
44
CanvasEraserLineState,
55
CanvasEraserLineWithPressureState,
6-
CanvasRectState,
76
CanvasImageState,
7+
CanvasRectState,
88
Coordinate,
99
Rect,
1010
} from 'features/controlLayers/store/types';
11+
12+
import { maskObjectsToBitmap } from './bitmapToMaskObjects';
1113
import {
12-
transformMaskObject,
13-
clipMaskObjectToContainer,
1414
calculateMaskObjectBounds,
15+
clipMaskObjectToContainer,
1516
convertTransformedToOriginal,
1617
type TransformedMaskObject,
18+
transformMaskObject,
1719
} from './coordinateTransform';
18-
import { maskObjectsToBitmap } from './bitmapToMaskObjects';
1920

2021
/**
2122
* Transforms mask objects relative to a bounding box container.
@@ -57,10 +58,7 @@ export function transformMaskObjectsRelativeToBbox(
5758
* @param container The container rectangle to clip to
5859
* @returns Array of clipped mask objects (null values are filtered out)
5960
*/
60-
export function clipMaskObjectsToContainer(
61-
objects: TransformedMaskObject[],
62-
container: Rect
63-
): TransformedMaskObject[] {
61+
export function clipMaskObjectsToContainer(objects: TransformedMaskObject[], container: Rect): TransformedMaskObject[] {
6462
return objects
6563
.map((obj) => clipMaskObjectToContainer(obj, container))
6664
.filter((obj): obj is TransformedMaskObject => obj !== null);
@@ -122,7 +120,7 @@ export function calculateMaskBoundsFromBitmap(
122120

123121
// Convert transformed objects back to original types for compatibility
124122
const originalObjects = objects.map(convertTransformedToOriginal);
125-
123+
126124
// Render the consolidated mask to a bitmap
127125
const bitmap = maskObjectsToBitmap(originalObjects, canvasWidth, canvasHeight);
128126
const { width, height, data } = bitmap;
@@ -167,10 +165,7 @@ export function calculateMaskBoundsFromBitmap(
167165
* @param container The container rectangle to invert within
168166
* @returns Array of mask objects representing the inverted mask
169167
*/
170-
export function invertMask(
171-
objects: TransformedMaskObject[],
172-
container: Rect
173-
): TransformedMaskObject[] {
168+
export function invertMask(objects: TransformedMaskObject[], container: Rect): TransformedMaskObject[] {
174169
// Create a rectangle that covers the entire container
175170
const fullCoverageRect: TransformedMaskObject = {
176171
id: 'inverted_mask_rect',
@@ -186,19 +181,24 @@ export function invertMask(
186181

187182
// For each original mask object, create an eraser line that removes it
188183
const eraserObjects: TransformedMaskObject[] = [];
189-
184+
190185
for (const obj of objects) {
191186
if (obj.type === 'rect') {
192187
// For rectangles, create an eraser rectangle
193188
const eraserRect: TransformedMaskObject = {
194189
id: `eraser_${obj.id}`,
195190
type: 'eraser_line',
196191
points: [
197-
obj.rect.x, obj.rect.y,
198-
obj.rect.x + obj.rect.width, obj.rect.y,
199-
obj.rect.x + obj.rect.width, obj.rect.y + obj.rect.height,
200-
obj.rect.x, obj.rect.y + obj.rect.height,
201-
obj.rect.x, obj.rect.y, // Close the rectangle
192+
obj.rect.x,
193+
obj.rect.y,
194+
obj.rect.x + obj.rect.width,
195+
obj.rect.y,
196+
obj.rect.x + obj.rect.width,
197+
obj.rect.y + obj.rect.height,
198+
obj.rect.x,
199+
obj.rect.y + obj.rect.height,
200+
obj.rect.x,
201+
obj.rect.y, // Close the rectangle
202202
],
203203
strokeWidth: 1,
204204
clip: container,
@@ -233,9 +233,6 @@ export function invertMask(
233233
* @param bboxRect The bounding box to clip to
234234
* @returns Array of clipped mask objects
235235
*/
236-
export function ensureMaskObjectsWithinBbox(
237-
objects: TransformedMaskObject[],
238-
bboxRect: Rect
239-
): TransformedMaskObject[] {
236+
export function ensureMaskObjectsWithinBbox(objects: TransformedMaskObject[], bboxRect: Rect): TransformedMaskObject[] {
240237
return clipMaskObjectsToContainer(objects, bboxRect);
241-
}
238+
}

0 commit comments

Comments
 (0)