58 lines
1.3 KiB
TypeScript
58 lines
1.3 KiB
TypeScript
|
|
import { BaseTool } from './base-tool';
|
||
|
|
import type { PointerState } from '@/types';
|
||
|
|
import { useLayerStore } from '@/store/layer-store';
|
||
|
|
|
||
|
|
export class MoveTool extends BaseTool {
|
||
|
|
private startX = 0;
|
||
|
|
private startY = 0;
|
||
|
|
private layerStartX = 0;
|
||
|
|
private layerStartY = 0;
|
||
|
|
|
||
|
|
constructor() {
|
||
|
|
super('Move');
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerDown(pointer: PointerState): void {
|
||
|
|
this.isActive = true;
|
||
|
|
this.isDrawing = true;
|
||
|
|
|
||
|
|
const layer = this.getActiveLayer();
|
||
|
|
if (!layer) return;
|
||
|
|
|
||
|
|
this.startX = pointer.x;
|
||
|
|
this.startY = pointer.y;
|
||
|
|
this.layerStartX = layer.x;
|
||
|
|
this.layerStartY = layer.y;
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerMove(pointer: PointerState): void {
|
||
|
|
if (!this.isDrawing) return;
|
||
|
|
|
||
|
|
const layer = this.getActiveLayer();
|
||
|
|
if (!layer) return;
|
||
|
|
|
||
|
|
const dx = pointer.x - this.startX;
|
||
|
|
const dy = pointer.y - this.startY;
|
||
|
|
|
||
|
|
const { updateLayer } = useLayerStore.getState();
|
||
|
|
updateLayer(layer.id, {
|
||
|
|
x: this.layerStartX + dx,
|
||
|
|
y: this.layerStartY + dy,
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerUp(): void {
|
||
|
|
this.isDrawing = false;
|
||
|
|
this.isActive = false;
|
||
|
|
}
|
||
|
|
|
||
|
|
getCursor(): string {
|
||
|
|
return 'move';
|
||
|
|
}
|
||
|
|
|
||
|
|
private getActiveLayer() {
|
||
|
|
const { activeLayerId, layers } = useLayerStore.getState();
|
||
|
|
return layers.find((l) => l.id === activeLayerId);
|
||
|
|
}
|
||
|
|
}
|