Files
image-studio/renderer/layers.ts
2026-07-03 16:19:05 +02:00

33 lines
1.4 KiB
TypeScript

import type { ImageDocument } from "@core/document";
import type { Layer } from "@core/layer";
import type { ViewportState } from "@editor/state";
import { resolveTransformTargetBounds } from "@editor/transform-targets";
import { clearScreenRect } from "./clear-rect";
import { documentRectToScreenRect } from "./screen-rect";
import type { RgbaColor, WebGlRendererContext } from "./types";
const imageLayerColor: RgbaColor = [0.38, 0.42, 0.5, 1];
const imageLayerInsetColor: RgbaColor = [0.48, 0.54, 0.64, 1];
export function renderLayers(context: WebGlRendererContext, document: ImageDocument, viewport: ViewportState) {
for (const artboard of document.artboards) {
for (const layer of artboard.layers) renderLayer(context, document, viewport, layer);
}
}
function renderLayer(context: WebGlRendererContext, document: ImageDocument, viewport: ViewportState, layer: Layer) {
if (!layer.visible) return;
if (layer.type === "group") {
for (const child of layer.children) renderLayer(context, document, viewport, child);
return;
}
const bounds = resolveTransformTargetBounds(document, { type: "layer", id: layer.id });
if (!bounds) return;
const rect = documentRectToScreenRect(context.canvas, bounds, viewport);
clearScreenRect(context, rect, imageLayerColor);
clearScreenRect(context, { x: rect.x + 4, y: rect.y + 4, w: Math.max(0, rect.w - 8), h: Math.max(0, rect.h - 8) }, imageLayerInsetColor);
}