mirror of
https://github.com/invoke-ai/InvokeAI
synced 2024-08-30 20:32:17 +00:00
tidy(ui): CanvasInpaintMask
This commit is contained in:
parent
0b7751c413
commit
c3ff3eb51f
@ -19,7 +19,7 @@ export class CanvasInpaintMask {
|
|||||||
static COMPOSITING_RECT_NAME = `${CanvasInpaintMask.NAME_PREFIX}_compositing-rect`;
|
static COMPOSITING_RECT_NAME = `${CanvasInpaintMask.NAME_PREFIX}_compositing-rect`;
|
||||||
|
|
||||||
private drawingBuffer: BrushLine | EraserLine | RectShape | null;
|
private drawingBuffer: BrushLine | EraserLine | RectShape | null;
|
||||||
private inpaintMaskState: InpaintMaskEntity;
|
private state: InpaintMaskEntity;
|
||||||
|
|
||||||
id = 'inpaint_mask';
|
id = 'inpaint_mask';
|
||||||
manager: CanvasManager;
|
manager: CanvasManager;
|
||||||
@ -33,7 +33,7 @@ export class CanvasInpaintMask {
|
|||||||
};
|
};
|
||||||
objects: Map<string, CanvasBrushLine | CanvasEraserLine | CanvasRect>;
|
objects: Map<string, CanvasBrushLine | CanvasEraserLine | CanvasRect>;
|
||||||
|
|
||||||
constructor(entity: InpaintMaskEntity, manager: CanvasManager) {
|
constructor(state: InpaintMaskEntity, manager: CanvasManager) {
|
||||||
this.manager = manager;
|
this.manager = manager;
|
||||||
|
|
||||||
this.konva = {
|
this.konva = {
|
||||||
@ -76,7 +76,7 @@ export class CanvasInpaintMask {
|
|||||||
this.konva.group.add(this.konva.compositingRect);
|
this.konva.group.add(this.konva.compositingRect);
|
||||||
this.objects = new Map();
|
this.objects = new Map();
|
||||||
this.drawingBuffer = null;
|
this.drawingBuffer = null;
|
||||||
this.inpaintMaskState = entity;
|
this.state = state;
|
||||||
}
|
}
|
||||||
|
|
||||||
destroy(): void {
|
destroy(): void {
|
||||||
@ -115,20 +115,20 @@ export class CanvasInpaintMask {
|
|||||||
this.setDrawingBuffer(null);
|
this.setDrawingBuffer(null);
|
||||||
}
|
}
|
||||||
|
|
||||||
async render(inpaintMaskState: InpaintMaskEntity) {
|
async render(state: InpaintMaskEntity) {
|
||||||
this.inpaintMaskState = inpaintMaskState;
|
this.state = state;
|
||||||
|
|
||||||
// Update the layer's position and listening state
|
// Update the layer's position and listening state
|
||||||
this.konva.group.setAttrs({
|
this.konva.group.setAttrs({
|
||||||
x: inpaintMaskState.position.x,
|
x: state.position.x,
|
||||||
y: inpaintMaskState.position.y,
|
y: state.position.y,
|
||||||
scaleX: 1,
|
scaleX: 1,
|
||||||
scaleY: 1,
|
scaleY: 1,
|
||||||
});
|
});
|
||||||
|
|
||||||
let didDraw = false;
|
let didDraw = false;
|
||||||
|
|
||||||
const objectIds = inpaintMaskState.objects.map(mapId);
|
const objectIds = state.objects.map(mapId);
|
||||||
// Destroy any objects that are no longer in state
|
// Destroy any objects that are no longer in state
|
||||||
for (const object of this.objects.values()) {
|
for (const object of this.objects.values()) {
|
||||||
if (!objectIds.includes(object.id)) {
|
if (!objectIds.includes(object.id)) {
|
||||||
@ -138,7 +138,7 @@ export class CanvasInpaintMask {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const obj of inpaintMaskState.objects) {
|
for (const obj of state.objects) {
|
||||||
if (await this.renderObject(obj)) {
|
if (await this.renderObject(obj)) {
|
||||||
didDraw = true;
|
didDraw = true;
|
||||||
}
|
}
|
||||||
@ -202,14 +202,14 @@ export class CanvasInpaintMask {
|
|||||||
}
|
}
|
||||||
|
|
||||||
updateGroup(didDraw: boolean) {
|
updateGroup(didDraw: boolean) {
|
||||||
this.konva.layer.visible(this.inpaintMaskState.isEnabled);
|
this.konva.layer.visible(this.state.isEnabled);
|
||||||
|
|
||||||
// The user is allowed to reduce mask opacity to 0, but we need the opacity for the compositing rect to work
|
// The user is allowed to reduce mask opacity to 0, but we need the opacity for the compositing rect to work
|
||||||
this.konva.group.opacity(1);
|
this.konva.group.opacity(1);
|
||||||
|
|
||||||
if (didDraw) {
|
if (didDraw) {
|
||||||
// Convert the color to a string, stripping the alpha - the object group will handle opacity.
|
// Convert the color to a string, stripping the alpha - the object group will handle opacity.
|
||||||
const rgbColor = rgbColorToString(this.inpaintMaskState.fill);
|
const rgbColor = rgbColorToString(this.state.fill);
|
||||||
const maskOpacity = this.manager.stateApi.getMaskOpacity();
|
const maskOpacity = this.manager.stateApi.getMaskOpacity();
|
||||||
|
|
||||||
this.konva.compositingRect.setAttrs({
|
this.konva.compositingRect.setAttrs({
|
||||||
|
Loading…
Reference in New Issue
Block a user