feat(ui): move updatePosition to transformer

This commit is contained in:
psychedelicious 2024-08-05 20:56:47 +10:00
parent ab16976084
commit 31ac02cd93
2 changed files with 21 additions and 18 deletions

View File

@ -6,7 +6,6 @@ import { konvaNodeToBlob, previewBlob } from 'features/controlLayers/konva/util'
import type {
CanvasLayerState,
CanvasV2State,
Coordinate,
GetLoggingContext,
} from 'features/controlLayers/store/types';
import { imageDTOToImageObject } from 'features/controlLayers/store/types';
@ -87,7 +86,7 @@ export class CanvasLayer {
await this.updateObjects({ objects });
}
if (this.isFirstRender || position !== this.state.position) {
await this.updatePosition({ position });
await this.transformer.updatePosition({ position });
}
if (this.isFirstRender || opacity !== this.state.opacity) {
await this.updateOpacity({ opacity });
@ -111,20 +110,6 @@ export class CanvasLayer {
this.konva.layer.visible(isEnabled && this.renderer.hasObjects());
};
updatePosition = (arg?: { position: Coordinate }) => {
this.log.trace('Updating position');
const position = get(arg, 'position', this.state.position);
this.konva.objectGroup.setAttrs({
x: position.x + this.transformer.pixelRect.x,
y: position.y + this.transformer.pixelRect.y,
offsetX: this.transformer.pixelRect.x,
offsetY: this.transformer.pixelRect.y,
});
this.transformer.update(position, this.transformer.pixelRect);
};
updateObjects = async (arg?: { objects: CanvasLayerState['objects'] }) => {
this.log.trace('Updating objects');

View File

@ -3,7 +3,7 @@ import { CanvasManager } from 'features/controlLayers/konva/CanvasManager';
import { getEmptyRect, getPrefixedId } from 'features/controlLayers/konva/util';
import type { Coordinate, GetLoggingContext, Rect } from 'features/controlLayers/store/types';
import Konva from 'konva';
import { debounce } from 'lodash-es';
import { debounce, get } from 'lodash-es';
import type { Logger } from 'roarr';
/**
@ -517,7 +517,7 @@ export class CanvasTransformer {
// canceled a transformation. In either case, the scale should be reset.
this.resetScale();
this.parent.updatePosition();
this.updatePosition();
this.updateBbox();
this.syncInteractionState();
};
@ -538,6 +538,24 @@ export class CanvasTransformer {
this.konva.proxyRect.setAttrs(attrs);
};
/**
* Updates the position of the transformer and the entity.
* @param arg The position to update to. If omitted, the parent's last stored position will be used.
*/
updatePosition = (arg?: { position: Coordinate }) => {
this.log.trace('Updating position');
const position = get(arg, 'position', this.parent.state.position);
this.parent.konva.objectGroup.setAttrs({
x: position.x + this.pixelRect.x,
y: position.y + this.pixelRect.y,
offsetX: this.pixelRect.x,
offsetY: this.pixelRect.y,
});
this.update(position, this.pixelRect);
};
/**
* Sets the transformer to a specific interaction mode.
* @param interactionMode The mode to set the transformer to. The transformer can be in one of three modes: