44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
|
|
import { BaseTool } from './base-tool';
|
||
|
|
import type { PointerState, ToolSettings } from '@/types';
|
||
|
|
import { getColorAtPoint } from '@/lib/color-utils';
|
||
|
|
import { useColorStore } from '@/store/color-store';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Eyedropper tool - Pick color from canvas
|
||
|
|
*/
|
||
|
|
export class EyedropperTool extends BaseTool {
|
||
|
|
constructor() {
|
||
|
|
super('Eyedropper');
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerDown(
|
||
|
|
pointer: PointerState,
|
||
|
|
ctx: CanvasRenderingContext2D,
|
||
|
|
settings: ToolSettings
|
||
|
|
): void {
|
||
|
|
this.pickColor(pointer.x, pointer.y, ctx);
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerMove(
|
||
|
|
pointer: PointerState,
|
||
|
|
ctx: CanvasRenderingContext2D,
|
||
|
|
settings: ToolSettings
|
||
|
|
): void {
|
||
|
|
if (!this.isDrawing) return;
|
||
|
|
this.pickColor(pointer.x, pointer.y, ctx);
|
||
|
|
}
|
||
|
|
|
||
|
|
onPointerUp(): void {
|
||
|
|
this.isDrawing = false;
|
||
|
|
}
|
||
|
|
|
||
|
|
private pickColor(x: number, y: number, ctx: CanvasRenderingContext2D): void {
|
||
|
|
const color = getColorAtPoint(ctx, Math.floor(x), Math.floor(y));
|
||
|
|
useColorStore.getState().setPrimaryColor(color);
|
||
|
|
}
|
||
|
|
|
||
|
|
getCursor(): string {
|
||
|
|
return 'crosshair';
|
||
|
|
}
|
||
|
|
}
|