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

tidy(ui): CanvasLayer

Browse Source
This commit is contained in:
psychedelicious 2024-07-17 14:36:13 +10:00
parent 3a25d00cb6
commit 868a25dae2
1 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -17,7 +17,7 @@ export class CanvasLayer {
static OBJECT_GROUP_NAME = `${CanvasLayer.NAME_PREFIX}_object-group`; static OBJECT_GROUP_NAME = `${CanvasLayer.NAME_PREFIX}_object-group`;
private drawingBuffer: BrushLine | EraserLine | RectShape | null; private drawingBuffer: BrushLine | EraserLine | RectShape | null;
private layerState: LayerEntity; private state: LayerEntity;
id: string; id: string;
manager: CanvasManager; manager: CanvasManager;
@ -30,8 +30,8 @@ export class CanvasLayer {
}; };
objects: Map<string, CanvasBrushLine | CanvasEraserLine | CanvasRect | CanvasImage>; objects: Map<string, CanvasBrushLine | CanvasEraserLine | CanvasRect | CanvasImage>;
constructor(entity: LayerEntity, manager: CanvasManager) { constructor(state: LayerEntity, manager: CanvasManager) {
this.id = entity.id; this.id = state.id;
this.manager = manager; this.manager = manager;
this.konva = { this.konva = {
layer: new Konva.Layer({ name: CanvasLayer.LAYER_NAME, listening: false }), layer: new Konva.Layer({ name: CanvasLayer.LAYER_NAME, listening: false }),
@ -71,7 +71,7 @@ export class CanvasLayer {
this.objects = new Map(); this.objects = new Map();
this.drawingBuffer = null; this.drawingBuffer = null;
this.layerState = entity; this.state = state;
} }
destroy(): void { destroy(): void {
@ -106,20 +106,20 @@ export class CanvasLayer {
this.setDrawingBuffer(null); this.setDrawingBuffer(null);
} }
async render(layerState: LayerEntity) { async render(state: LayerEntity) {
this.layerState = layerState; 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: layerState.position.x, x: state.position.x,
y: layerState.position.y, y: state.position.y,
scaleX: 1, scaleX: 1,
scaleY: 1, scaleY: 1,
}); });
let didDraw = false; let didDraw = false;
const objectIds = layerState.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) && object.id !== this.drawingBuffer?.id) { if (!objectIds.includes(object.id) && object.id !== this.drawingBuffer?.id) {
@ -129,7 +129,7 @@ export class CanvasLayer {
} }
} }
for (const obj of layerState.objects) { for (const obj of state.objects) {
if (await this.renderObject(obj)) { if (await this.renderObject(obj)) {
didDraw = true; didDraw = true;
} }
@ -208,13 +208,13 @@ export class CanvasLayer {
} }
updateGroup(didDraw: boolean) { updateGroup(didDraw: boolean) {
if (!this.layerState.isEnabled) { if (!this.state.isEnabled) {
this.konva.layer.visible(false); this.konva.layer.visible(false);
return; return;
} }
this.konva.layer.visible(true); this.konva.layer.visible(true);
this.konva.group.opacity(this.layerState.opacity); this.konva.group.opacity(this.state.opacity);
const isSelected = this.manager.stateApi.getIsSelected(this.id); const isSelected = this.manager.stateApi.getIsSelected(this.id);
const selectedTool = this.manager.stateApi.getToolState().selected; const selectedTool = this.manager.stateApi.getToolState().selected;