Implement ArcTool.ts

This commit is contained in:
2026-06-22 07:23:39 +00:00
parent f3c0c65f8d
commit b8a8464636
+68
View File
@@ -0,0 +1,68 @@
import { Tool } from '../Tool';
import { YjsDocument } from '../../crdt/YjsDocument';
class ArcTool extends Tool {
private centerPoint: { x: number; y: number } | null = null;
private startPoint: { x: number; y: number } | null = null;
constructor(yjsDoc: YjsDocument) {
super(yjsDoc);
this.name = 'ArcTool';
}
onMouseDown(event: MouseEvent): void {
if (!this.centerPoint) {
this.centerPoint = { x: event.clientX, y: event.clientY };
} else if (!this.startPoint) {
this.startPoint = { x: event.clientX, y: event.clientY };
} else {
// Calculate start and end angles and create arc element in Yjs document
const startAngle = Math.atan2(
this.startPoint.y - this.centerPoint.y,
this.startPoint.x - this.centerPoint.x
);
const endAngle = Math.atan2(
event.clientY - this.centerPoint.y,
event.clientX - this.centerPoint.x
);
const radius = Math.sqrt(
Math.pow(this.startPoint.x - this.centerPoint.x, 2) +
Math.pow(this.startPoint.y - this.centerPoint.y, 2)
);
this.yjsDoc.createArc(
this.centerPoint.x,
this.centerPoint.y,
radius,
startAngle,
endAngle
);
this.reset();
}
}
onMouseMove(event: MouseEvent): void {
// Preview arc while drawing
}
onMouseUp(event: MouseEvent): void {
// Handle mouse up if needed
}
onKeyUp(event: KeyboardEvent): void {
// Handle key up events
if (event.key === 'Escape') {
this.reset();
}
}
reset(): void {
this.centerPoint = null;
this.startPoint = null;
}
}
export { ArcTool };