fix(ui): transforming when axes flipped

This commit is contained in:
psychedelicious 2024-07-30 17:46:05 +10:00
parent d15321a373
commit ba5cf07ab8

View File

@ -554,15 +554,14 @@ export class CanvasLayer {
} }
async resetScale() { async resetScale() {
this.konva.objectGroup.scaleX(1); const attrs = {
this.konva.objectGroup.scaleX(1); scaleX: 1,
this.konva.objectGroup.rotation(0); scaleY: 1,
this.konva.bbox.scaleX(1); rotation: 0,
this.konva.bbox.scaleX(1); };
this.konva.bbox.rotation(0); this.konva.objectGroup.setAttrs(attrs);
this.konva.interactionRect.scaleX(1); this.konva.bbox.setAttrs(attrs);
this.konva.interactionRect.scaleX(1); this.konva.interactionRect.setAttrs(attrs);
this.konva.interactionRect.rotation(0);
} }
async applyTransform() { async applyTransform() {
@ -570,11 +569,14 @@ export class CanvasLayer {
this.isTransforming = false; this.isTransforming = false;
const objectGroupClone = this.konva.objectGroup.clone(); const objectGroupClone = this.konva.objectGroup.clone();
const blob = await konvaNodeToBlob(objectGroupClone, objectGroupClone.getClientRect()); const interactionRectClone = this.konva.interactionRect.clone();
const rect = interactionRectClone.getClientRect();
const blob = await konvaNodeToBlob(objectGroupClone, rect);
console.log('transform rect', rect);
previewBlob(blob, 'transformed layer'); previewBlob(blob, 'transformed layer');
const imageDTO = await uploadImage(blob, `${this.id}_transform.png`, 'other', true, true); const imageDTO = await uploadImage(blob, `${this.id}_transform.png`, 'other', true, true);
const { dispatch } = getStore(); const { dispatch } = getStore();
dispatch(layerRasterized({ id: this.id, imageDTO, position: this.konva.interactionRect.position() })); dispatch(layerRasterized({ id: this.id, imageDTO, position: { x: rect.x, y: rect.y } }));
this.isTransforming = false; this.isTransforming = false;
this.resetScale(); this.resetScale();
} }