ff762b8f17
- Enhanced cursor behavior for new tools: semantic select, mask lasso, and mask rectangle. - Updated mask edit state to include mask asset ID and kind. - Implemented inpaint region commands for adding, applying, and removing inpaint regions. - Introduced new operations for lasso and semantic selection tools. - Created UI components for candidate review and inpaint region management. - Added tests for inpaint region commands to ensure functionality. - Updated various components to support new inpaint features and improve user experience.
33 lines
1.5 KiB
TypeScript
33 lines
1.5 KiB
TypeScript
import type { EditorState } from "@editor/state";
|
|
import { clearScreenRect } from "./clear-rect";
|
|
import type { WebGlRendererContext } from "./types";
|
|
|
|
const previewColor = [1, 0.18, 0.24, 0.95] as const;
|
|
|
|
export function renderMaskShapePreview(context: WebGlRendererContext, editor: EditorState) {
|
|
const session = editor.maskShapeSession;
|
|
const points = session?.shape === "rectangle" && session.points.length > 1
|
|
? rectanglePoints(session.points[0]!, session.points[1]!)
|
|
: session?.points;
|
|
if (!points || points.length === 0) return;
|
|
const screenPoints = points.map((point) => ({
|
|
x: context.canvas.width / 2 + (point.x - editor.viewport.center.x) * editor.viewport.zoom,
|
|
y: context.canvas.height / 2 + (point.y - editor.viewport.center.y) * editor.viewport.zoom,
|
|
}));
|
|
const closed = screenPoints.length > 2 ? [...screenPoints, screenPoints[0]!] : screenPoints;
|
|
for (let index = 1; index < closed.length; index += 1) {
|
|
const from = closed[index - 1]!;
|
|
const to = closed[index]!;
|
|
const distance = Math.max(1, Math.hypot(to.x - from.x, to.y - from.y));
|
|
const steps = Math.max(1, Math.ceil(distance / 3));
|
|
for (let step = 0; step <= steps; step += 1) {
|
|
const amount = step / steps;
|
|
clearScreenRect(context, { x: from.x + (to.x - from.x) * amount - 1.5, y: from.y + (to.y - from.y) * amount - 1.5, w: 3, h: 3 }, previewColor);
|
|
}
|
|
}
|
|
}
|
|
|
|
function rectanglePoints(start: { x: number; y: number }, end: { x: number; y: number }) {
|
|
return [start, { x: end.x, y: start.y }, end, { x: start.x, y: end.y }];
|
|
}
|