tidy(ui): CanvasRect

This commit is contained in:
psychedelicious 2024-07-17 14:37:31 +10:00
parent 98ebca5f8c
commit 0dc38bd684

View File

@ -7,15 +7,16 @@ export class CanvasRect {
static GROUP_NAME = `${CanvasRect.NAME_PREFIX}_group`; static GROUP_NAME = `${CanvasRect.NAME_PREFIX}_group`;
static RECT_NAME = `${CanvasRect.NAME_PREFIX}_rect`; static RECT_NAME = `${CanvasRect.NAME_PREFIX}_rect`;
private state: RectShape;
id: string; id: string;
konva: { konva: {
group: Konva.Group; group: Konva.Group;
rect: Konva.Rect; rect: Konva.Rect;
}; };
lastRectShape: RectShape;
constructor(rectShape: RectShape) { constructor(state: RectShape) {
const { id, x, y, width, height } = rectShape; const { id, x, y, width, height, color } = state;
this.id = id; this.id = id;
this.konva = { this.konva = {
group: new Konva.Group({ name: CanvasRect.GROUP_NAME, listening: false }), group: new Konva.Group({ name: CanvasRect.GROUP_NAME, listening: false }),
@ -27,16 +28,16 @@ export class CanvasRect {
width, width,
height, height,
listening: false, listening: false,
fill: rgbaColorToString(rectShape.color), fill: rgbaColorToString(color),
}), }),
}; };
this.konva.group.add(this.konva.rect); this.konva.group.add(this.konva.rect);
this.lastRectShape = rectShape; this.state = state;
} }
update(rectShape: RectShape, force?: boolean): boolean { update(state: RectShape, force?: boolean): boolean {
if (this.lastRectShape !== rectShape || force) { if (this.state !== state || force) {
const { x, y, width, height, color } = rectShape; const { x, y, width, height, color } = state;
this.konva.rect.setAttrs({ this.konva.rect.setAttrs({
x, x,
y, y,
@ -44,7 +45,7 @@ export class CanvasRect {
height, height,
fill: rgbaColorToString(color), fill: rgbaColorToString(color),
}); });
this.lastRectShape = rectShape; this.state = state;
return true; return true;
} else { } else {
return false; return false;