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

feat(ui): add repr methods to layer and object classes

Browse Source
This commit is contained in:
psychedelicious 2024-07-31 15:06:46 +10:00
parent 17cd2f6b02
commit 3f781016f6
5 changed files with 95 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
invokeai/frontend/web/src/features/controlLayers/konva/CanvasBrushLine.ts
View File

@ -1,4 +1,5 @@
import { rgbaColorToString } from 'common/util/colorCodeTransformers';
import { deepClone } from 'common/util/deepClone';
import type { CanvasLayer } from 'features/controlLayers/konva/CanvasLayer';
import type { BrushLine } from 'features/controlLayers/store/types';
import Konva from 'konva';
@ -52,7 +53,7 @@ export class CanvasBrushLine {
this.state = state;
}
async update(state: BrushLine, force?: boolean): Promise<boolean> {
update(state: BrushLine, force?: boolean): boolean {
if (force || this.state !== state) {
this.parent._log.trace(`Updating brush line ${this.id}`);
const { points, color, clip, strokeWidth } = state;
@ -74,4 +75,21 @@ export class CanvasBrushLine {
this.parent._log.trace(`Destroying brush line ${this.id}`);
this.konva.group.destroy();
}
show() {
this.konva.group.visible(true);
}
hide() {
this.konva.group.visible(false);
}
repr() {
return {
id: this.id,
type: this.type,
parent: this.parent.id,
state: deepClone(this.state),
};
}
}

20
invokeai/frontend/web/src/features/controlLayers/konva/CanvasEraserLine.ts
View File

@ -1,4 +1,5 @@
import { rgbaColorToString } from 'common/util/colorCodeTransformers';
import { deepClone } from 'common/util/deepClone';
import type { CanvasLayer } from 'features/controlLayers/konva/CanvasLayer';
import type { EraserLine } from 'features/controlLayers/store/types';
import { RGBA_RED } from 'features/controlLayers/store/types';
@ -53,7 +54,7 @@ export class CanvasEraserLine {
this.state = state;
}
async update(state: EraserLine, force?: boolean): Promise<boolean> {
update(state: EraserLine, force?: boolean): boolean {
if (force || this.state !== state) {
this.parent._log.trace(`Updating eraser line ${this.id}`);
const { points, clip, strokeWidth } = state;
@ -74,4 +75,21 @@ export class CanvasEraserLine {
this.parent._log.trace(`Destroying eraser line ${this.id}`);
this.konva.group.destroy();
}
show() {
this.konva.group.visible(true);
}
hide() {
this.konva.group.visible(false);
}
repr() {
return {
id: this.id,
type: this.type,
parent: this.parent.id,
state: deepClone(this.state),
};
}
}

21
invokeai/frontend/web/src/features/controlLayers/konva/CanvasImage.ts
View File

@ -1,3 +1,4 @@
import { deepClone } from 'common/util/deepClone';
import type { CanvasLayer } from 'features/controlLayers/konva/CanvasLayer';
import { FILTER_MAP } from 'features/controlLayers/konva/filters';
import { loadImage } from 'features/controlLayers/konva/util';
@ -157,4 +158,24 @@ export class CanvasImage {
this.parent._log.trace(`Destroying image ${this.id}`);
this.konva.group.destroy();
}
show() {
this.konva.group.visible(true);
}
hide() {
this.konva.group.visible(false);
}
repr() {
return {
id: this.id,
type: this.type,
parent: this.parent.id,
imageName: this.imageName,
isLoading: this.isLoading,
isError: this.isError,
state: deepClone(this.state),
};
}
}

24
invokeai/frontend/web/src/features/controlLayers/konva/CanvasLayer.ts
View File

@ -655,14 +655,24 @@ export class CanvasLayer {
);
}, CanvasManager.BBOX_DEBOUNCE_MS);
logDebugInfo(msg = 'Debug info') {
const debugInfo = {
repr() {
return {
id: this.id,
state: this._state,
rect: this.rect,
bbox: this.bbox,
objects: Array.from(this.objects.values()).map((obj) => obj.id),
type: 'layer',
state: deepClone(this._state),
rect: deepClone(this.rect),
bbox: deepClone(this.bbox),
bboxNeedsUpdate: this._bboxNeedsUpdate,
isFirstRender: this._isFirstRender,
isTransforming: this.isTransforming,
isPendingBboxCalculation: this.isPendingBboxCalculation,
objects: Array.from(this.objects.values()).map((obj) => obj.repr()),
};
}
logDebugInfo(msg = 'Debug info') {
const info = {
repr: this.repr(),
interactionRectAttrs: {
x: this.konva.interactionRect.x(),
y: this.konva.interactionRect.y(),
@ -684,6 +694,6 @@ export class CanvasLayer {
offsetY: this.konva.objectGroup.offsetY(),
},
};
this._log.debug(debugInfo, msg);
this._log.trace(info, msg);
}
}

20
invokeai/frontend/web/src/features/controlLayers/konva/CanvasRect.ts
View File

@ -1,4 +1,5 @@
import { rgbaColorToString } from 'common/util/colorCodeTransformers';
import { deepClone } from 'common/util/deepClone';
import type { CanvasLayer } from 'features/controlLayers/konva/CanvasLayer';
import type { RectShape } from 'features/controlLayers/store/types';
import Konva from 'konva';
@ -45,7 +46,7 @@ export class CanvasRect {
this.state = state;
}
async update(state: RectShape, force?: boolean): Promise<boolean> {
update(state: RectShape, force?: boolean): boolean {
if (this.state !== state || force) {
this.parent._log.trace(`Updating rect ${this.id}`);
const { x, y, width, height, color } = state;
@ -67,4 +68,21 @@ export class CanvasRect {
this.parent._log.trace(`Destroying rect ${this.id}`);
this.konva.group.destroy();
}
show() {
this.konva.group.visible(true);
}
hide() {
this.konva.group.visible(false);
}
repr() {
return {
id: this.id,
type: this.type,
parent: this.parent.id,
state: deepClone(this.state),
};
}
}