diff options
| author | Maze Winther <mazewinther@gmail.com> | 2026-04-20 11:31:17 +0200 |
|---|---|---|
| committer | Maze Winther <mazewinther@gmail.com> | 2026-04-20 11:31:17 +0200 |
| commit | 3e89d2998588f8e35c524e523ba2ee853f0f6475 (patch) | |
| tree | 57221f96c1259b3b07e3ddf8c1adefc502b9d8eb /apps/web/src/lib/graphics/definitions/rectangle.ts | |
| parent | 729d10592f4e802f91c555c309ff3ba4b119f843 (diff) | |
| download | opencut-3e89d2998588f8e35c524e523ba2ee853f0f6475.tar.gz | |
refactor: restructure files to their domains, new preview overlay system, and dep graph
Diffstat (limited to 'apps/web/src/lib/graphics/definitions/rectangle.ts')
| -rw-r--r-- | apps/web/src/lib/graphics/definitions/rectangle.ts | 85 |
1 files changed, 0 insertions, 85 deletions
diff --git a/apps/web/src/lib/graphics/definitions/rectangle.ts b/apps/web/src/lib/graphics/definitions/rectangle.ts deleted file mode 100644 index fb52c03a..00000000 --- a/apps/web/src/lib/graphics/definitions/rectangle.ts +++ /dev/null @@ -1,85 +0,0 @@ -import type { ParamDefinition } from "@/lib/params";
-import { applyAlignedStroke } from "../stroke";
-import { STROKE_ALIGN_PARAM, type GraphicStrokeAlign } from "./shared";
-import type { GraphicDefinition } from "../types";
-
-interface RectangleParams {
- fill: string;
- stroke: string;
- strokeWidth: number;
- strokeAlign: GraphicStrokeAlign;
- cornerRadius: number;
-}
-
-const RECTANGLE_PARAMS: ParamDefinition<keyof RectangleParams & string>[] = [
- {
- key: "fill",
- label: "Fill",
- type: "color",
- default: "#ffffff",
- },
- {
- key: "stroke",
- label: "Color",
- type: "color",
- default: "#000000",
- group: "stroke",
- },
- {
- key: "strokeWidth",
- label: "Width",
- type: "number",
- default: 0,
- min: 0,
- max: 64,
- step: 1,
- shortLabel: "W",
- group: "stroke",
- },
- STROKE_ALIGN_PARAM,
- {
- key: "cornerRadius",
- label: "Corner radius",
- type: "number",
- default: 0,
- min: 0,
- max: 50,
- step: 1,
- shortLabel: "R",
- },
-];
-
-export const rectangleGraphicDefinition: GraphicDefinition = {
- id: "rectangle",
- name: "Rectangle",
- keywords: ["rectangle", "square", "box"],
- params: RECTANGLE_PARAMS,
- render({ ctx, params, width, height }) {
- const fill = String(params.fill ?? "#ffffff");
- const stroke = String(params.stroke ?? "#000000");
- const strokeWidth = Math.max(0, Number(params.strokeWidth ?? 0));
- const strokeAlign = (params.strokeAlign ?? "center") as GraphicStrokeAlign;
- const inset = strokeAlign === "center" ? strokeWidth / 2 : 0;
- const drawWidth = Math.max(1, width - inset * 2);
- const drawHeight = Math.max(1, height - inset * 2);
- const radiusPercent = Math.max(0, Number(params.cornerRadius ?? 0));
- const radius =
- (Math.min(drawWidth, drawHeight) / 2) * Math.min(radiusPercent, 50) / 50;
-
- ctx.clearRect(0, 0, width, height);
- const path = new Path2D();
- path.roundRect(inset, inset, drawWidth, drawHeight, radius);
- ctx.fillStyle = fill;
- ctx.fill(path);
-
- if (strokeWidth > 0) {
- applyAlignedStroke({
- ctx,
- path,
- strokeWidth,
- strokeAlign,
- strokeColor: stroke,
- });
- }
- },
-};
|